<template>
  <el-dialog :visible.sync="open" @close="close" :title="title" width="80%">
    <el-form ref="elForm" :model="formData" size="small" label-width="100px" label-position="left">
      <el-row :gutter="15">
        <el-col :span="6">
          <el-form-item label="事件名称" prop="eventName">
            <span>{{ formData.name }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="事件类型" prop="eventType">
            <dict-tag :options="dict.type.usetypecode_dict" :value="formData.type" />
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="事件等级" prop="event_level">
            <dict-tag :options="dict.type.eventlevelcode_dict" :value="formData.level" />
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="发生时间" prop="eventTime">
            <span>{{ formData.findTime }}</span>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="15">
        <el-col :span="6">
          <el-form-item label="发生地" prop="eventLocaltion">
            <span>{{ formData.location }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="位置坐标" prop="eventLocaltion">
            <span>{{ formData.coordinate }}</span>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="15">
        <el-col :span="24">
          <el-form-item label="事故简况" prop="contentTitle">
            <span>{{ formData.briefIntroduction }}</span>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="15">
        <el-col :span="24">
          <el-form-item label="影响范围" prop="impactArea">
            <span>{{ formData.coverage }}</span>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="15">
        <el-col :span="24">
          <el-form-item label="事件起因" prop="surroundings">
            <span>{{ formData.initialReason }}</span>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="15">
        <el-col :span="24">
          <el-form-item label="基本过程" prop="eventCause">
            <span>{{ formData.basicProcess }}</span>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <div slot="footer">
      <el-button @click="close">关闭</el-button>
      <el-button type="primary" @click="handleEdit">修改事件信息</el-button>
    </div>
  </el-dialog>
</template>
<script>
import dialogMixin from "@/mixins/dialogMixin";
import * as RescueApi from "@/api/rescue/rescue";

export default {
  name: "PlanEventDetailDialog",
  mixins: [dialogMixin],
  dicts: ["usetypecode_dict", "eventlevelcode_dict"],
  components: {},
  props: [],
  data() {
    return {
      formData: {},
      title: "救援事件信息",
    };
  },
  computed: {},
  watch: {},
  created() {},
  mounted() {},
  methods: {
    showDetail(eventId) {
      RescueApi.getPlanEventInfo(eventId).then(res => {
        this.formData = Object.assign({}, res.data);
        this.open = true;
      });
    },
    handleEdit() {
      this.close();
      this.$emit("onEdit", this.formData);
    },
  },
};
</script>
<style></style>
